<!--导出-->
<template>
    <div>
        <el-dialog title="" class="import-loading-dialog" :visible.sync="dialogProgressVisible" :close-on-click-modal="false" width="320px" top="40vh" height="150px" append-to-body>
            <el-progress :text-inside="true" ref="progressBar" :stroke-width="18" :percentage="percentage" :status="progressStatus"></el-progress>
            <p class="tc tips">{{isSuccessImport ? subText + '成功！':`正在${subText}，请稍后...`}}</p>
        </el-dialog>

    </div>
</template>
<script>
export default {
    name: 'LoadingDialog',
    props: {
        identifyKey: {
            type: [Number, String],
            default: 0
        },
        loadingText: {
            type: String,
            default: '导出'
        },
        loadingApi: {
            type: String,
            default: 'loadingProgressAuthskip'
        }
    },
    watch: {
        loadingText (val) {
            this.subText = val
        }
    },
    data () {
        return {
            dialogProgressVisible: false,
            progressStatus: 'exception',
            percentage: 0,
            subText: this.loadingText,
            isSuccessImport: false
        }
    },
    components: {},
    methods: {
        initdata () { // 初始化数据
            this.dialogProgressVisible = false
            this.progressStatus = 'exception'
            this.percentage = 0
            this.isSuccessImport = false
        },
        start (call) {
            this.initdata()
            this.handleExport()
            var timer = setInterval(a => {
                this.handleExport((exportResult) => {
                    clearInterval(timer)
                    setTimeout(() => {
                        this.dialogProgressVisible = false
                        if (call && call instanceof Function) {
                            call(exportResult)
                            return
                        }
                        this.$message({
                            message: (exportResult.result && exportResult.result.message) || exportResult.message || '操作失败！',
                            type: exportResult.success && exportResult.result && exportResult.result.normal ? 'success' : 'error'
                        })
                        if (this.percentage === 100 && exportResult.success && exportResult.result.fileUrl) {
                            window.location.href = exportResult.result.fileUrl
                        }
                    }, 1000)
                })
            }, 1000)
        },
        async handleExport (call) {
            this.dialogProgressVisible = true
            try {
                let exportResult = await this.$api.common[this.loadingApi]({
                    identifyKey: this.identifyKey
                })
                if (!exportResult.result) {
                    call && call(exportResult)
                    return
                }
                if (exportResult.success && exportResult.result !== null) {
                    if (!exportResult.result.normal) {
                        call && call(exportResult)
                        return false
                    }
                }
                this.percentage = exportResult.result.processingValue
                if (this.percentage === 100) {
                    this.progressStatus = 'success'
                    this.isSuccessImport = true
                    this.percentage = exportResult.result.processingValue
                    call && call(exportResult)
                }
            } catch (error) {
                call && call({})
                throw (error)
            }
        }
    },
    mounted () {

    }
}
</script>
<style lang='less' scoped>

</style>
